<style>
    .layui-form-label {
        float: left;
        display: block;
        padding: 9px 15px;
        width: 120PX;
        font-weight: 400;
        line-height: 20px;
        text-align: right;
    }
    .layui-input-block {
        margin-left: 150px;
        min-height: 36px;
    }
</style>
<div class="layui-fluid layui-anim website-anim-up" id="website-class-checkDelay" lay-title="延期审核">
    <div class="layui-row layui-col-space8 website-container">
        <div class="layui-col-md12 layui-col-sm12 layui-col-xs12">
            <form class="layui-form" lay-filter="class-delay-form">
                <input type="hidden" name="declareId" th:value="${declareId}">
                <div class="layui-card" id="client-user-info">
                    <div class="layui-card-body layui-form-item">
                        <div class="layui-form-item">
                        <div class="layui-col-md6">
                            <label class="layui-form-label website-form-item-require">延期时长（月）：</label>
                            <div class="layui-input-block">
                                <input type="text" name="duration" readonly class="layui-input">
                            </div>
                        </div>
                        <div class="layui-col-md6">
                            <label class="layui-form-label website-form-item-require">延期期限：</label>
                            <div class="layui-input-block">
                                <input type="text" name="term" readonly class="layui-input">
                            </div>
                        </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-col-md6">
                                <label class="layui-form-label website-form-item-require">延期理由：</label>
                                <div class="layui-input-block">
                                    <input type="text" name="reason" readonly class="layui-input">
                                </div>
                            </div>
                            <div class="layui-col-md6">
                                <label class="layui-form-label">延期申请附件：</label>
                                <a type="text" disabled id="delayFileName"></a>
                            </div>
                        </div>
                        <div class="layui-row">
                            <label class="layui-form-label website-form-item-require">审核结果</label>
                            <div class="layui-input-block">
                                <input type="radio" name="statusTypeCode" lay-filter="applyRadio" value="delay_passed" title="通过" checked="">
                                <input type="radio" name="statusTypeCode" lay-filter="applyRadio" value="delay_failed" title="不通过">
                            </div>
                        </div>
                        <div class="layui-row" id="checkResult">
                            <div class="layui-inline layui-col-md12">
                                <label class="layui-form-label website-form-item-require">审核不通过的原因</label>
                                <div class="layui-input-block">
                                    <textarea class="layui-textarea" name="checkResult" placeholder="请输入内容，限制 500 字" autocomplete="off"></textarea>
                                </div>
                            </div>
                        </div>
                        <div class="layui-card-footer">
                            <button type="submit" class="layui-btn" lay-submit="" lay-filter="checkDelay">审核提交</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<script data-th-inline="javascript" type="text/javascript">
    layui.use(['dropdown', 'jquery', 'form', 'website'], function () {
        var $ = layui.jquery,
                website = layui.website,
                form = layui.form,
                view = layui.view,
                delayApply = [[${delayApply}]];
        // 重新渲染 form否则不会显示下拉框
        form.render();
        initDelayValue();
        $("#checkResult").css("display", "none");
        form.on('radio(applyRadio)', function(data){
            if(data.value == 'delay_failed'){
                $("#checkResult").css("display", "block");

            } else {
                $("#checkResult").css("display", "none");
                $("#titleResult").val("");
            }
        });
        form.on('submit(checkDelay)', function(data){
            if(data.field.statusTypeCode=='delay_failed'&& (data.field.checkResult==""||data.field.checkResult==null)){
                website.alert.error('审核不通过的原因不能为空');
                return false;
            }
            data.field.delayApplyId=delayApply.delayApplyId;
            website.post(ctx + 'declareEntrust/checkDelay/commit', data.field, function () {
                layer.closeAll();
                website.alert.success('操作成功');
                $('#website-declareEntrust').find('#query').click();
            });
            return false;
        });
        function initDelayValue() {
            $('#delayFileName')[0].setAttribute('href', ctx + 'download/' + delayApply.delayFileId);
            if(delayApply.delayFileName!=null&&delayApply.delayFileName!=''){
                $("#delayFileName").text(delayApply.delayFileName);
            }
            form.val("class-delay-form", {
                "duration": delayApply.duration,
                "term": delayApply.term,
                "reason": delayApply.reason,
                "delayFile": delayApply.delayFile
            });
        }
    })


</script>